@extends('layouts.base')

@section('title',trim($show->full_name))
@section('keyWords',$show->key_word)
@section('description',strip_tags($show->detail))

@section('content')



    <div class="well">
        @include('show._breadCrumb')
        <h1 class="text-center lead text-info">{{$show->name_en.$show->name_zh }}
            @if(Auth::id() == 1)
                <a href="/show/{{$show->id}}/edit" class="btn btn-danger btn-sm">编辑</a>
            @endif
        </h1>
        <hr>
        <header class="clearfix">
            <ul class="list-inline pull-right text-danger">
                <li>
                    <span class="glyphicon glyphicon-calendar"></span>
                    发布于
                    <time class="entry-date published" datetime="{{ $show->created_at }}">{{ $show->created_at}}</time>
                </li>
                <li>
                    <span class="glyphicon glyphicon-time"></span>
                    更新于
                    <time class="entry-date last-updated" datetime={{ $show->updated_at }}>{{ $show->created_at }}</time>
                </li>
                <li>
                    <span class="glyphicon glyphicon-eye-open"></span>浏览:{{$show->vote->visit}}
                </li>
                <li>
                    <span class="glyphicon glyphicon-th"></span>资源:{{ $show->episodes->count()}}条
                </li>
            </ul>
        </header>


        @if($show->articles()->count())
            <hr>
            <h3 class="text-center text-danger lead">相关文章</h3>
            <div class="row">
                <div class="row text-center">
                    @foreach($show->articles as $article)
                        <div class="col-xs-6" style="padding-left: 20px;padding-right: 20px;padding-bottom: 12px">
                            <a href="//www.mojotv.cn/article/{{$article->id}}">{{$article->title}}</a>
                        </div>
                    @endforeach
                </div>
            </div>
            <hr>
    @endif
        <!-- Nav tabs -->
        <ul class="nav nav-tabs" role="tablist">
            <li role="presentation" class="active"><a href="#resource" aria-controls="home" role="tab" data-toggle="tab">资源下载</a></li>
            <li role="presentation"><a href="#detail" aria-controls="messages" role="tab" data-toggle="tab">剧情介绍</a></li>
            <li role="presentation"><a href="#image" aria-controls="settings" role="tab" data-toggle="tab">剧情截图</a></li>
            <li role="presentation"><a href="#review" aria-controls="profile" role="tab" data-toggle="tab">网友评分</a></li>
        </ul>

        <!-- Tab panes -->
        <div class="tab-content" style="margin: 24px 12px 24px 12px">
            {{--资源下载--}}
            <div role="tabpanel" class="tab-pane active" id="resource">
                @include('episode._episodesTable',['episodes'=>$show->episodes])
                @if(Auth::id() == 1)
                    <a href="{{url('swapShow',$show)}}" role="button" class="btn btn-success btn-block"> 重新归档剧集</a>
                @endif
            </div>
            {{--资源下载--}}
            {{--剧情介绍--}}
            <div role="tabpanel" class="tab-pane" id="detail">
                {!! $show->detail !!}
            </div>
            {{--剧情介绍--}}
            {{--图片--}}
            <div role="tabpanel" class="tab-pane" id="image">
                <div class="row">
                    @foreach($show->images as $key => $image)
                        <div class="col-sm-6">
                            <img class="img-thumbnail" style="width: 100%!important;" src="{{$image->water_mark}}">
                        </div>
                    @endforeach
                </div>
            </div>
            {{--图片--}}
            {{--评论--}}
            <div role="tabpanel" class="tab-pane" id="review">
                <div class="row">
                    <form>
                        <div class="form-group ">
                            <label for="input-score "
                                   class="control-label col-xs-3 col-sm-4 col-md-5 lead text-info">当前有<strong
                                        id="vote_count">{{$show->vote->vote_count}}</strong>人评价平均分:</label>
                            <input id="input-score" name="input-name" type="number"
                                   class="rating col-xs-9 col-sm-8 col-md-7" value="{{$show->vote->score}}" min=0 max=5
                                   step=0.1 data-size="sm" data-show-clear="false"
                                   data-show-caption="{{$show->vote->score}}" data-readonly="true">
                        </div>
                        <div class="form-group">
                            <label for="input-rating"
                                   class="control-label col-xs-3 col-sm-4 col-md-5 lead text-info">您的评分:</label>
                            <input id="input-rating" name="input-name" type="number"
                                   class="rating-loading col-xs-9 col-sm-8 col-md-7" min=0 max=5 step=0.1 data-size="sm"
                                   data-show-clear="false">
                        </div>

                    </form>
                </div>
            </div>
            {{--评论--}}
        </div>
    </div>
@endsection





@section('scripts')
    <script type="text/javascript">
        $('#input-rating').rating({clearCaption: '请评分'});
        $('#input-rating').on('rating.change', function (event, value, caption) {
            $.post("{{url('vote/forShow')}}",
                {
                    '_token': '{{csrf_token()}}',
                    id: "{{$show->id}}",
                    score: value
                },
                function (data, status) {
                    var returnScore = data.score.toFixed(2);
                    $('#input-score').rating('update', returnScore);
                    $('#input-rating').rating('refresh', {disabled: true, showClear: false, showCaption: true});
                    $('#vote_count').text(data.vote_count);
                });

        });
    </script>
@endsection



@section('ld_json')
    <script type="application/ld+json">
        {
          "@context": "http://schema.org",
          "@type": "BlogPosting",
          "mainEntityOfPage": {
            "@type": "WebPage",
            "@id": "{{url()->current()}}"
          },
          "headline": "{{$show->name_en.$show->name_zh }}",
          "image": {
            "@type": "ImageObject",
            "url": "{{$show->coverage_url}}",
            "height": 200,
            "width": 200
          },
          "datePublished": "{{$show->updated_at}}",
          "dateModified": "{{$show->created_at}}",
          "author": {
            "@type": "Person",
            "name": "Eric Zhou"
          },
           "publisher": {
            "@type": "Organization",
            "name": "TRY美剧",
            "logo": {
              "@type": "ImageObject",
              "url": "https://google.com/logo.jpg",
              "width": 600,
              "height": 60
            }
          },
          "description": "{{$show->body}}"
        }
    </script>
@endsection
